app.directive('ngGraphDashboradLineChart', [ function () {
	return {
		restrict: 'EA',
		scope:{
			data:'='
		},
		link: function (scope, element, attrs) {
			var chart = echarts.init($(element)[0]);
			var initEchart = function (xAxis,legend,series) {
				var option = {
					tooltip : {
						trigger: 'axis'   //tooltip触发方式:axis以X轴线触发,item以每一个数据项触发
					},
					legend: {
						data:legend
					},
					toolbox: {
						show : true,   //是否显示工具栏
						feature : {
							mark : {show: true},
							magicType : {show: true, type: ['line', 'bar']},   //支持柱形图和折现图的切换
							saveAsImage : {show: true}   //是否保存图片
						}
					},
					calculable : true,
					xAxis : [
						{
							type : 'category',   //X轴均为category，Y轴均为value
							boundaryGap : false,   //数值轴两端的空白策略
							data : xAxis,
							axisLine:{
								lineStyle:{
									color:'blue'
								}
							}
						}
					],					
					yAxis : [
						{
							type : 'value',
							axisLine:{
								lineStyle:{
									color:'blue'
								}
							}
						}
					],
					grid: {
						left: '1%',
						right: '100',
						top:'10%',
						bottom: '6%',
						containLabel: true
					},
					series : series
				};
				chart.setOption(option);
			};
			var colorList = ['#87CEEB','#7CFC00','#8B8B00','#CD0000','#FFD700']
			var legendData = [],series = [];
			//数据处理
			(function () {
				scope.data.values.forEach(function (item,index) {
					legendData.push(item.name);
					series.push({
						name:item.name,
						type:'line',
						smooth:true,
						itemStyle: {
							normal: {
//								areaStyle: {type: 'default'},  //曲线面积图
								color:colorList[index],
								opacity:0.8
							}},
						data:item.data
					});
				});
				//参数1：横坐标数据    参数2：图表选项数组    参数3：图表数据对象数组
				initEchart(scope.data.keys,legendData,series);
			})();
		}}
}]);
app.directive('ngGraphDashboradPieChart', [function () {
	return {
		restrict: 'EA',
		scope:{
			theme:'=',
			data:'='
		},
		link: function (scope, element, attrs) {
			var chart = echarts.init($(element)[0]);
			var initEchart = function (legend,series) {
				var option = {
					tooltip : {
						trigger: 'item',
						formatter: "{a} <br/>{b} : {c} ({d}%)"
					},
					legend: {
						orient : 'vertical',
						x : 'left',
						data:legend
					},
					toolbox: {
						show : true,
						feature : {
							saveAsImage : {show: true}
						}
					},
					calculable : true,
					series : [
						{
							name:scope.theme,
							type:'pie',
							radius : '55%',
							center: ['50%', '60%'],
							data:series
						}
					]
				};
				chart.setOption(option);
			};
			var legendData = [];
			(function(){
				scope.data.forEach(function (item) {
					legendData.push(item.name);
				});
				initEchart(legendData,scope.data);
			})();
		}
	}
}]);
